<template>
	<div class="register">
		<h4>个人资料修改</h4>
		<el-form :model="psUser" :rules="rules" ref="ruleForm" label-width="100px" class="demo-psUser">
			<el-form-item label="用户账号" prop="usercode">
				<el-input v-model="psUser.usercode"></el-input>
			</el-form-item>
			<el-form-item label="用户姓名" prop="username">
				<el-input v-model="psUser.username"></el-input>
			</el-form-item>
			<el-form-item label="请输入旧密码" prop="oldUserPassword">
				<el-input v-model="psUser.oldUserPassword" type="password"></el-input>
			</el-form-item>
			<el-form-item label="请输入新密码" prop="newUserPassword">
				<el-input v-model="psUser.newUserPassword" type="password"></el-input>
			</el-form-item>
			<el-form-item label="请确认新密码" prop="confirmUserPassword">
				<el-input v-model="psUser.confirmUserPassword" type="password"></el-input>
			</el-form-item>
			<el-form-item label="用户性别" prop="sex">
				<el-select v-model="psUser.sex" placeholder="请选择性别">
					<el-option label="男" value="Male"></el-option>
					<el-option label="女" value="Female"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="年龄" prop="age">
				<el-input v-model="psUser.age"></el-input>
			</el-form-item>
			<el-form-item label="入职日期" prop="entrydate">
				<el-input v-model="psUser.entrydate" type="date"></el-input>
			</el-form-item>
			<el-form-item label="离职日期" prop="dimissiondate">
				<el-input v-model="psUser.dimissiondate" type="date"></el-input>
			</el-form-item>
			<el-form-item label="联系电话" prop="phonetel">
				<el-input v-model="psUser.phonetel"></el-input>
			</el-form-item>
			<el-form-item label="电子邮件" prop="email">
				<el-input v-model="psUser.email"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="submitForm('ruleForm')">修改</el-button>
				<el-button @click="resetForm('ruleForm')">重置</el-button>
				<el-button type="warning" @click="returns()">返回</el-button>
			</el-form-item>
		</el-form>
	</div>
</template>
<script>
	import axios from 'axios';

	import md5 from 'crypto-js/md5';


	import {
		PersonalDataUpd,
		verifyOldPwd
	} from '@/config/request'

	export default {

		data() {
			return {
				psUser: {
					id: '',
					usercode: '',
					username: '',
					userpassword: '',
					oldUserPassword: '',
					newUserPassword: '',
					confirmUserPassword: '',
					sex: '',
					age: '',
					entrydate: '',
					dimissiondate: '',
					phonetel: '',
					email: '',
					creationtime: '', // 将当前时间赋值给 creationtime
					lastlogintime: '',
					createdby: '',
					lastupdatetime: '', // 将当前时间赋值给 lastupdatetime
					userstatus: '1',
					roleid: '',
				},
				psUserBypwd: {
					id: '',
					userpassword: '',
				},
				rules: {
					usercode: [{
							required: true,
							message: '请输入用户账号',
							trigger: 'blur'
						},
						{
							min: 5,
							max: 8,
							message: '长度在 5 到 8 个字符',
							trigger: 'blur'
						}
					],
					username: [{
							required: true,
							message: '请输入用户姓名',
							trigger: 'blur'
						},
						{
							min: 3,
							max: 3,
							message: '长度在 3 个字符',
							trigger: 'blur'
						}
					],
					newUserPassword: [{
							required: true,
							message: '请输入新密码',
							trigger: 'blur'
						},
						{
							min: 6,
							max: 8,
							message: '长度在 6 到 8 个字符',
							trigger: 'blur'
						}
					],
					confirmUserPassword: [{
							required: true,
							message: '请确认新用户密码',
							trigger: 'blur'
						},
						{
							min: 6,
							max: 8,
							message: '长度在 6 到 8 个字符',
							trigger: 'blur'
						}
					],
					sex: [{
						required: true,
						message: '请选择性别',
						trigger: 'change'
					}],
					roleid: [{
						required: true,
						message: '请选择角色',
						trigger: 'change'
					}],
					age: [{
							required: true,
							message: '请输入用户年龄',
							trigger: 'blur'
						},
						{
							min: 1,
							max: 3,
							message: '长度在 1 到 3 个字符',
							trigger: 'blur'
						}
					],
					phonetel: [{
							required: true,
							message: '请输入用户手机号码',
							trigger: 'blur'
						},
						{
							min: 11,
							max: 11,
							message: '长度在 11 个字符',
							trigger: 'blur'
						}
					],
					email: [{
							required: true,
							message: '请输入电子邮箱',
							trigger: 'blur'
						},
						{
							min: 6,
							max: 18,
							message: '长度在 6 到 18 个字符',
							trigger: 'blur'
						}
					]
				}
			};
		},
		methods: {
			load() {
				this.psUser = JSON.parse(sessionStorage.getItem('psUser'));
			},
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.psUserBypwd.userpassword = this.psUser.oldUserPassword;
						this.psUserBypwd.id = this.psUser.id;
						verifyOldPwd(this.psUserBypwd).then(json => {
							if (json == 'no') {
								alert("输入的旧密码有误");
							}else if(this.psUser.newUserPassword != this.psUser.confirmUserPassword){
								alert("新密码和确认密码输入的不一致");
							}else{
								this.psUser.userpassword = this.psUser.newUserPassword;
								PersonalDataUpd(this.psUser).then(json=>{
									if(json.code == 200){
										alert("修改成功")
										sessionStorage.setItem('psUser',JSON.stringify(json.data.obj));
									}else{
										alert("修改失败")
									}
								})
							}
						})

					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
			},
			returns() {
				this.$router.go(-1);
			}
		},
		created() {
			this.load();
		}
	}
</script>
<style>
	.register {
		max-width: 600px;
		margin: 0 auto;
		padding: 30px;
		border: 1px solid #ccc;
		border-radius: 4px;
	}

	.register h4 {
		text-align: center;
	}
</style>